<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <title>日志信息</title>   
        <link href="css/bootstrap.min.css" rel="stylesheet">   
		<link href="css/datepicker.css" rel="stylesheet">
    </head>
	<script type="text/javascript" src="js/jquery-1.10.2.min.js"></script>
	<script type="text/javascript" src="js/jquery.validate.min.js"></script>	
	<script type="text/javascript" src="js/bootstrap.min.js"></script>
	<script src="js/bootstrap-datepicker.min.js"></script>	
	<script src="js/bootstrap-datepicker-cn.js"></script>	
	<script src="js/my/log-msg.js"></script>
	<!-- 定义错误提示的样式：字体红色、加粗  -->
	<style type="text/css">	
		label.error{
			font-weight:bold;
			color:red;
		}
		input.error{
			border:1px solid red;
		}
	</style>	 
    <body>
		<div class="navbar navbar-inverse" role="navigation">
		  <div class="navbar-header">
			 <a href="##" class="navbar-brand">日志分析系统</a>
			 <img  class="img-circle" src="img/1.png" style="height:50px;wight:55px;"/> 
		  </div>
		  <ul class="nav navbar-nav">
			  <li class="active"><a href="">首页</a></li>
			<li><a href="">导航1</a></li>
			<li><a href="">导航2</a></li>
		  </ul>
		</div>
		
		<div class="container-fluid">
			<div class="panel panel-default">
				<!-- Default panel contents -->
				<div class="panel-heading">
					<div class="btn-group" role="group" aria-label="">
						<form name="queryForm" id="queryForm" action="http://127.0.0.1/appLog/queryByParams" method="get"
							class="navbar-form navbar-right form-horizontal" role="search">
							<input type="hidden" id="currentPage" value="1" name="currentPage" />
							<input type="hidden" id="pageSize" value="10" name="pageSize"/>
							
							<div class="col-sm-4 has-success">
								<label class="col-sm-4 control-label">日志详情</label>
								<div class="col-sm-8">
									<input type="text" class="form-control" id="logInfo" name="logInfo" placeholder="模糊搜索">
								</div>
							</div>
							<div class="col-sm-8 has-success">			
								<label class="col-sm-4 control-label ">开始日期</label>
								<div class="col-sm-2">
									<input type="text" class="form-control" id="startDate" name="startDate" placeholder="日志开始日期" data-date-format="yyyy-mm-dd">
								</div>
								<label class="col-sm-2 control-label">截止日期</label>
								<div class="col-sm-3">
									<input type="text" class="form-control" id="endDate" name="endDate" placeholder="日志截止日期" data-date-format="yyyy-mm-dd" >
								</div>
							</div>
							<div class="col-sm-12">
								&nbsp;
							</div>
							<div class="col-sm-4 has-success">
								<label class="col-sm-4 control-label">类名</label>
								<div class="col-sm-8">
									<input type="text" class="form-control" id="className" name="className" placeholder="类名">
								</div>
							</div>
							<div class="col-sm-8 has-success">
								<label class="col-sm-4 control-label">日志级别</label>
								<div class="col-xs-8">
									<select class="form-control" id="logLeval" name="logLeval" value="">
										<option value="">请选择</option>
										<option value="DEBUG">DEBUG</option>
										<option value="ERROR">ERROR</option>
										<option value="INFO">INFO</option>
									</select>
								</div>
							</div>
							
							<div class="col-sm-10"></div>
							<div class="col-sm-2">
								<button type="button" class="btn btn-success" onclick="search();">搜索</button>
								&nbsp;&nbsp;&nbsp;&nbsp;
								<button type="button" class="btn btn-info" onclick="resetForm();" >重置</button>
							</div>
						</form>
					</div>
				</div>

				<table class="table table-hover table-striped table-bordered">
					<thead>
						<tr>
							<th style="text-align: center;vertical-align: middle;width:3%;">No.</th>
							<th style="text-align: center;vertical-align: middle;width:7%;">日志ID</th>
							<th style="text-align: center;vertical-align: middle;width:10%;">日志时间</th>
							<th style="text-align: center;vertical-align: middle;width:15%;">线程名</th>
							<th style="text-align: center;vertical-align: middle;width:10%;">日志级别</th>
							<th style="text-align: center;vertical-align: middle;width:15%;">类名</th>
							<th style="text-align: center;vertical-align: middle;width:40%;">日志详情</th>
						</tr>
					</thead>
					<tbody id="logInfo-tbody"></tbody>
				</table>
			</div>
			
			<div class="page" style="padding-bottom:100px;">
				<div class="col-sm-2"></div>
				<div class="col-sm-8">
					<div class="col-sm-1"></div>
					<div class="col-sm-2">
						<select class="form-control input-sm" style="width:130px;" id="pageSizeView" name="pageSizeView">
							<option value="10">显示10条/页</option >
							<option value="20">显示20条/页</option >
							<option value="50">显示50条/页</option >
							<option value="100">显示100条/页</option >
						</select>
					</div>
					<div class="col-sm-2" style ="font-size:16px;line-height:30px;">
						<b><div class="col-sm-12">共 <label id="allCount" class="control-label"></label> 条记录</div></b>
					</div>
					<div class="col-sm-3" style ="font-size:16px;line-height: 30px;">
						<b><label class="col-sm-1">第</label>
						<div class="col-sm-4">
							<input type="text" class="form-control input-sm"  id="currentPageView"  title="输入页码，快速跳转" onblur="jump(this.value)"> 
						</div>
						<label class="col-sm-1">页</label>
						/ 共 <label id="pageCount" class="control-label"></label> 页</b>
					</div>
					<div class="col-sm-4" style ="font-size:16px;line-height:30px;">
						<em>
							<a href="javascript:void(0)" onclick="jump('1');return false;">首页</a>&nbsp;&nbsp;&nbsp;&nbsp;
							<a href="javascript:void(0)" onclick="jump('pre');return false;">上一页</a>&nbsp;&nbsp;&nbsp;&nbsp;
							<a href="javascript:void(0)" onclick="jump('next');return false;">下一页</a>&nbsp;&nbsp;&nbsp;&nbsp;
							<a href="javascript:void(0)"onclick="jump('last');return false;">尾页</a>
						</em>
					</div>
				</div>		
			</div>
		</div>
    </body>
</html>
